'use client'

import { useParams, useRouter } from 'next/navigation'
import { Card, Button, Descriptions } from 'antd'
import { ArrowLeftOutlined } from '@ant-design/icons'
import { useApp } from '@/app/context/app-context'
import ChatBox from '@/app/components/chat/chat-box'

// 应用数据映射表
const APP_DATA: Record<string, { key: string; name: string; description: string; version: string; author: string; createTime: string }> = {
  '1': {
    key: 'chatgpt',
    name: 'ChatGPT',
    description: 'OpenAI 开发的大语言模型，擅长对话和创意写作',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '2': {
    key: 'claude',
    name: 'Claude',
    description: 'Anthropic 开发的AI助手，擅长分析和学术写作',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '3': {
    key: 'gemini',
    name: 'Gemini',
    description: 'Google 最新的多模态大模型，支持文本、图像理解',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '4': {
    key: 'qianwen',
    name: '通义千问',
    description: '阿里云开发的中文大模型，深度理解中文语境',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '5': {
    key: 'baichuan',
    name: '百川',
    description: '国产开源大模型，在多个中文任务上表现优异',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '6': {
    key: 'deepresearch',
    name: 'DeepResearch',
    description: '智能研究助手，支持论文分析、文献综述和学术写作',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '7': {
    key: 'writer',
    name: '写作助手',
    description: '专业写作辅助工具，支持多种文体创作和文章润色',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '8': {
    key: 'translator',
    name: '翻译专家',
    description: '多语言翻译助手，支持多种语言互译和本地化优化',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  },
  '9': {
    key: 'coder',
    name: '代码助手',
    description: '智能编程助手，支持多语言代码生成和问题诊断',
    version: '1.0.0',
    author: '中科数字',
    createTime: '2024-03-20'
  }
}

export default function AppDetailPage() {
  const router = useRouter()
  const params = useParams()
  const appId = params.appId as string
  const appData = APP_DATA[appId]

  if (!appData) {
    return <div className="p-6">应用不存在</div>
  }

  return (
    <div className="flex flex-col h-[calc(100vh-var(--header-height))]">
      <div className="flex-none p-6">
        {/* 返回按钮 */}
        <Button
          icon={<ArrowLeftOutlined />}
          className="mb-6"
          onClick={() => router.push('/explore/apps')}
        >
          返回
        </Button>

        {/* 应用详情 */}
        <Card title={appData.name} className="mb-6">
          <Descriptions column={2}>
            <Descriptions.Item label="版本">{appData.version}</Descriptions.Item>
            <Descriptions.Item label="作者">{appData.author}</Descriptions.Item>
            <Descriptions.Item label="创建时间">{appData.createTime}</Descriptions.Item>
          </Descriptions>
          <p className="mt-4 text-gray-600">{appData.description}</p>
        </Card>
      </div>

      {/* 聊天界面 */}
      <div className="flex-1 overflow-hidden">
        <ChatBox appKey={appData.key} />
      </div>
    </div>
  )
} 